<template>
    <el-button type="primary" @click="batchExportExcel">批量导出(Excel)</el-button>
    <el-button type="success" @click="chooseExportExcel">选择导出(Excel)</el-button>

    <el-table :data="customerPageInfo.list" style="width: 100%" @selection-change="handSelection">
        <el-table-column type="selection" width="50" />
        <el-table-column type="index" label="序号" width="55" />
        <el-table-column property="ownerDo.name" label="负责人" />
        <el-table-column property="activityDo.name" label="所属活动" />
        <el-table-column property="clueDo.fullName" label="姓名">
            <template #default="scope">
                <a href="javascript:void(0)" @click="view(scope.row.id)">{{ scope.row.clueDo.fullName }}</a>
            </template>
        </el-table-column>
        <el-table-column property="appellationDo.typeValue" label="称呼" />
        <el-table-column property="clueDo.phone" label="手机" />
        <el-table-column property="clueDo.weixin" label="微信" />
        <el-table-column property="needLoanDo.typeValue" label="是否贷款" />
        <el-table-column property="intentionStateDo.typeValue" label="意向状态" />
        <el-table-column property="sourceDo.typeValue" label="客户来源" />
        <el-table-column property="intentionProductDo.name" label="意向产品" />
        <el-table-column property="nextContactTime" label="下次跟踪时间" />
        <el-table-column label="操作">
            <template #default="scope">
                <el-button type="primary" @click="view(scope.row.id)">详情</el-button>
            </template>
        </el-table-column>
    </el-table>
    <el-pagination background layout="prev, pager, next, jumper, total" :total="customerPageInfo.total"
        :page-size="customerPageInfo.pageSize" @change="toPage" />
</template>

<script setup>
import { ref ,onMounted} from 'vue'
import { showMessage } from '../util/message'
import { doGet,doDownload } from '../http/httpRequest'
import { saveAs } from 'file-saver'
import { useRouter } from 'vue-router'



const customerPageInfo = ref({})

onMounted(() => {
    loadCustomerList(1)
})

//查询客户分页信息
const loadCustomerList = async current => {
    //向后端发送请求，查询客户分页信息
    let res = await doGet('/api/customer', {
        current: current
    })
    if (res.data.code == 200) {
        //将查询到的客户分页信息赋值给customerPageInfo
        customerPageInfo.value = res.data.info
    } else {
        showMessage("查询客户分页信息失败",'error')
    }
}

const toPage = (current) => {
    loadCustomerList(current)
}

//excel导出
const batchExportExcel = async () => {
    let resp = await doDownload('/api/exportExcel',{ids:''})
    //利用filesaver处理blob数据
    saveAs(new Blob([resp.data]), '客户列表.xlsx')
}


//定义id的数组
let idArray = []

//获取选中的客户id
const handSelection = (item) => {
    idArray = []
    for(let index in item){
        idArray.push(item[index].id)
    }
}

//批量导出
const chooseExportExcel = async () => {
    if(idArray.length == 0){
        showMessage("请选择客户",'warning')
        return
    }
    let resp = await doDownload('/api/exportExcel',{ids:idArray.join(',')})

    //利用filesaver处理blob数据
    saveAs(new Blob([resp.data]), '客户列表.xlsx')
}

let router = useRouter()

//查看详情
const view = id => {
    router.push('/dashboard/customer/' + id)
}

</script>

<style scoped></style>